<template>
	<view class="mm-location">
		<view class="mm-location__wrap" @click="openLocation" :style="{color: $theme.linkColor}">
			<text class="mm-location__wrap__icon icon-position"></text>
			<text class="mm-location__wrap__label">{{address}}</text>
		</view>
	</view>
</template>

<script>
	// 查看定位组件，由于和权限挂钩，故封装
	export default {
		props: {
			position: {
				type: Object,
				default: () => ({
					longitude: 0,
					latitude: 0
				})
			},
			address: {
				type: String,
				default: ''
			}
		},
		methods: {
			openLocation() {
				uni.openLocation({
					latitude: this.position.latitude,
					longitude: this.position.longitude,
					fail: () => {
						this.$w.permission('location');
					}
				});
			}
		}
	}
</script>

<style lang="scss">
	@font-face {
		font-family: "iconfont";
		src: url('data:application/x-font-woff2;charset=utf-8;base64,d09GMgABAAAAAAK0AAsAAAAABnQAAAJqAAEAAAAAAAAAAAAAAAAAAAAAAAAAAAAAHEIGVgCCcApYdwE2AiQDCAsGAAQgBYURBzIbwwUR1YtRsr9ABnKr+AEhtBv6vJilyVE3FZqG+UBxgx5QCr+BBAAAAACIIFwjZ5M8AJVY1ROTqiQJaGt8VYVjdmVL7rY2fd0pbIRhSurBd2lWfjHC5cOoEL59w3MHKAE3r9OHBbq/whZB9UBbs7UEY1FOhKGxAPifa+olHh3wB/B1UmUJTWf5vBtohBvByDeM3aCCh54TaDTKDLFw8cqN6hXZukCcPHZkn/qZTVGcYL1QCzhaxC016tPl9KfcbD8fv+RRT1KTZWlrDy86aO7X33lYVrGzRtgJxukaZMxAITYCfatl4dBZo68Yx7GSg6+/q6rWiqOqhPPXZYnNYFhnPxOn5D5qYgKl7+/DNKbtpMaWfV/jN1tevdp0UV34pV/88uXG6bTqnHenx90hZ9SMPv2+A8zDcBSMJnzpi6nOGfXvmAuqy3nOCQT/Pe7+0VTAhzVTai3V5aLIDNTvTx/8Fw5hW4l5mSaVkAM0JH1MaxMaNaJimjp9ZpX33EQoNOm5FUOdMSNkTSajhZyJ1pCz0FpyKTSabsPpJl3Oy6I0YJrbGoRe9yBp9QyyXl/QQv5BaqhoQmvJsdBoc3Blk0nhXj/F2Aj20P7AdTTrIltOr0FoiuaDn2jWsWG3fHB/kYPTeyGLU0CwwhlZ3I6wmVxEg2aaoOT8Go4jwcLksZPYiixFkmjQm+KOJnUSYyPYQ/sD19Gs68ty8hqEpgj1PU8069gwug5A7hc5OH0ykMUpGVqJZ9KqR3wkbCYX0aCZTQelg0ruOBIs4EUeO4ktg2cpkrybJhXHaqXTL2U5dWSKFHlG5iwFJ2+jUgo=') format('woff2');
	}
	
	.mm-location {
		// 由于图标左右有间隙，导致与上下文字稍微错位
		transform: translateX(-3rpx);
		display: flex;
		&__wrap {
			&__icon {
				margin-right: 5rpx;
				font-family: 'iconfont' !important;
				font-size: 32rpx;
				font-style: normal;
				-webkit-font-smoothing: antialiased;
				-moz-osx-font-smoothing: grayscale;
			}
			.icon-position:before {
				content: "\e6ec";
			}
			&__label {
				font-size: 26rpx;
			}
		}
	}
</style>
